import React, {Component} from "react";
import PropTypes from 'prop-types'
class TodoItem extends Component {
    constructor(props) {
        super(props)
        this.handleClick = this.handleClick.bind(this)
    }
    shouldComponentUpdate(nextProps, nextState, nextContext) {
        console.log('in component update')
        if(nextProps.content!==this.props.content) return true;
        return false;
    }
    render() {
        console.log('did idi')
        const {item,test} = this.props
        return (
            <div onClick={this.handleClick}>{item}-{test}</div>
        )
    }

    handleClick() {
        //解构赋值优化代码
        const {hdd, index} = this.props/**/
        hdd(index)
        // 调用父组件的值修改
    }
    // componentWillMount() {
    //     console.log('will mount')
    // }
    // componentDidMount() {
    //     console.log('did mount')
    // }
    // // 父组件接受参数 子组件render执行就会执行这个函数
    // componentWillReceiveProps(nextProps, nextContext) {
    //     console.log('props')
    // }
    // //需要更新吗 ？

    // componentWillUpdate(nextProps, nextState, nextContext) {
    //     console.log('upadfsf')
    // }
    // componentDidUpdate(prevProps, prevState, snapshot) {
    //     console.log('did update')
    // }
    // componentWillUnmount() {
    //     console.log('un mount')
    // }
}

TodoItem.propTypes = {
    test:PropTypes.string.isRequired,
    content:PropTypes.string,
    hdd:PropTypes.func,
    index:PropTypes.number
}
TodoItem.defaultProps = {
    test:'heooo~'
}

export default TodoItem;
